<template>
  <div class="dashboard-container">
    <div class="app-container">题库-精选</div>
    <!-- 按钮部分 -->
    <el-card shadow="never">
      <div class="btn">
        <el-button type="primary">新增试题</el-button>
        <el-button type="success">批量导入</el-button>
      </div>
      <!-- 学科选择部分 -->
      <div class="object_chose">
        <span>学科</span>
        <el-select v-model="value" placeholder="请选择">
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        ></el-option>
      </el-select>
      </div>
      <!--状态部分-->
        <div class="state_chose">
          <span>状态</span>
              <el-select v-model="value" placeholder="请选择" size:'small'>
        <el-option

          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        ></el-option>
      </el-select>
        </div>
    </el-card>
  </div>
</template>

<script>
export default {
  name: 'QuestionsChoice',
  data() {
    return {}
  }
}
</script>

<style scoped lang="scss">
// 1. 如果在此处 scoped 当前组件下生效样式
// 2. 在style中的所有选择器 编译的时候会自动带上属性选择器
// 3. .box{} ===> .box[data-v-2c9827a4]{} 交集选择器
// 4. 在当前组件下暴露的标签都会加上 data-v-2c9827a4 属性
// 5. 但是如果是组件，其他组件内部的标签是不会加上这个属性 意味写组件内部的样式是不会生效的
// 6. 其他组件的样式都不会生效
</style>
